import React, { useEffect } from "react";
import { ProcessCard } from "@/components";
import { getWorkflowList, GetWorkflowListReq, WorkflowInfo } from "@/services";
import { useSafeState } from "ahooks";
import { useUserStore } from "@/store";
import { ErrorBlock } from "antd-mobile";

const Service: React.FC = () => {
  const [workFlowList, setWorkFlowList] = useSafeState<WorkflowInfo[]>([]);
  const { userInfo, getUserInfo } = useUserStore();
  const getWorkflowListRequest = async () => {
    const req: GetWorkflowListReq = {
      title: "", // 业务标题
      busionessType: 2, // 业务类型1-卖房；2-买房
      homeName: "", // 房产名称
      userName: "", // 创建人
      nickName: "", // 用户昵称,微信昵称
      contactPerson: "", // 联系人
      tel: "", // 联系电话
      userId: "",
      // creator: userInfo.onlyId,
      page: 1,
      size: 100,
    };
    const res = await getWorkflowList(req);
    if (res.code == 200) {
      setWorkFlowList(res.data.list);
    }
  };

  useEffect(() => {
    getUserInfo();
  }, []);

  useEffect(() => {
    if (userInfo.onlyId) {
      getWorkflowListRequest();
    }
  }, [userInfo.onlyId]);

  return (
    <div>
      <div className="h-10px"></div>
      {workFlowList.map((item, index) => (
        <ProcessCard key={index} record={item} />
      ))}
      {workFlowList.length === 0 && (
        <div className="mt-100px ">
          <ErrorBlock status="empty" title="暂无数据" description="" />
        </div>
      )}
      <div className="h-70px"></div>
    </div>
  );
};

export default Service;
